<template>
	<u-popup class="cancel-popup" v-model="payshow" mode="bottom" length="30%">
		<view class="text-center py-2 position-relative">
			<text @click="payshow = false" class="position-absolute left-0 top-0 mt-2 px-2 ft999999">取消</text>
			<text class="font-weight-bold">选择支付方式</text>
			<text @click="submit" class="position-absolute right-0 top-0 mt-2 px-2 fte87722 pl-5">确认</text>
		</view>
		<view class="body">
			<view class="border-bottom fs-32  text-center py-3 " v-for="(item,index) in pays" :key="index"
				:class="activeIndex === index?'bge87722 text-white':'text-black'" @click="changePay(index)">
				{{item.label}}
			</view>

		</view>
	</u-popup>
</template>

<script>
	export default {
		data() {
			return {
				activeIndex: -1,
				payshow: false,
				wxpay: [{
						method: 'wechat',
						label: '微信支付'
					},
					{
						method: 'alipay',
						label: '支付宝支付'
					},
					{
						method: 'alipay_credit',
						label: '芝麻免押'
					}
				],
				alipayPay: [{
						method: 'alipay',
						label: '支付宝支付'
					},
					{
						method: 'alipay_credit',
						label: '芝麻免押'
					}
				],
				pays: []
			}
		},
		methods: {
			submit() {
				this.$emit('checkPay', this.pays[this.activeIndex])
				this.hide()
			},
			changePay(index) {
				this.activeIndex = index
			},
			show() {
				const publicWeb = uni.getStorageSync('publicWeb') || {}
				if (!publicWeb.alipay) {
					this.pays = this.wxpay.filter(i => i.method == 'wechat')
				} else {
					this.pays = this.wxpay
				}
				//#ifdef MP-ALIPAY
				this.pays = this.alipayPay
				// #endif

				this.payshow = true
			},
			hide() {
				this.payshow = false
			}
		}
	}
</script>

<style>
</style>